﻿@model List<RoadQualityEvalAPI.Models.RoleModel>

@{
    var totalRolesCount = Model.Count;
}

<script type="text/javascript">


    $('.roleCreate').on('click', function (evt) {


        evt.preventDefault();
        evt.stopPropagation();

        //alert("Clicked");
        console.log('clicked');

        var $contentDiv = $('#content'), url = $(this).data('url');

        $.get(url, function (data) {

            $contentDiv.replaceWith(data);

        });

    });

    $('.roleEdit').on('click', function (evt) {


        evt.preventDefault();
        evt.stopPropagation();

        //alert("Clicked");
        console.log('clicked');

        var $contentDiv = $('#content'), url = $(this).data('url');

        $.get(url, function (data) {

            $contentDiv.replaceWith(data);

        });

    });


</script>


<h4>Roles Administration:</h4>
<hr />

<div id="roles_administration">

    <div class="row">
        <p>User roles administration section</p>
        <p>Manage the roles in the system (such as admin, moderator, client user, etc.) in order to grant permissions to users according to their role</p>
    </div>

    <div class="row">
        @Html.Label("Total number of roles: " + totalRolesCount)
    </div>

    <div class="row">
        <button data-url='@Url.Action("CreateRole", "Admin")' class="roleCreate">Create New Role</button>    
    </div>

    <div class="row">

        <table class="customTable">

            <tr>
                <th>
                    @Html.DisplayNameFor(m => m.FirstOrDefault().RoleName)
                </th>
                <th>
                    @Html.DisplayNameFor(m => m.FirstOrDefault().RoleInfo)
                </th>
                <th>
                    @Html.Raw("Actions")
                </th>
            </tr>

            @foreach (var role in Model)
            {
                
                <tr>
                    <td>
                        @Html.DisplayFor(m => role.RoleName)
                    </td>
                    <td>
                        @Html.DisplayFor(m => role.RoleInfo)
                    </td>
                    <td>
                         <button data-url='@Url.Action("EditRole", "Admin", new { rolename = role.RoleName })' class="roleEdit">Edit Role</button>
                        @Html.ActionLink("See Role Details", "RoleDetails", new {  }) |
                        @Html.ActionLink("Delete Role", "DeleteRole", new { id = role.RoleId }, new { onclick = "return confirm('Are you sure you wish to delete this role?');" })
                    </td>
                </tr>
                 
            }


        </table>

    </div>

</div>
